var msgbox={
    callback:""
}

msgbox.init=function(){
    if(!document.querySelector("dialog")){
        console.error("页面没有定义dialog");
        document.write("<dialog></dialog");
    }
}

msgbox.Loading=function(){
    msgbox.init();
    document.querySelector("dialog").setAttribute("style","position:fixed; width:100px; height:100px; overflow:hide; box-shadow:0 0 5px silver; border-radius: 10px; border:0; line-height:100px; user-select:none; left:calc(50% - 50px); top:calc(50vh - 50px);");
    m.render(document.querySelector("dialog"),[
        m("div",{style:"text-align:center; font-size:16px; color:#999999; font-weight:bold;"},"Loading")
    ]);
    document.querySelector("dialog").showModal();
}

msgbox.Hide=function(){
    document.querySelector("dialog").close();
}

msgbox.Error=function(msg){
    msgbox.init();
    document.querySelector("dialog").setAttribute("style","position:fixed; width:300px; height:200px; overflow:hide; box-shadow:0 0 5px silver; border-radius: 10px; border:0; user-select:none; left:calc(50% - 150px); top:calc(50vh - 100px);");
    m.render(document.querySelector("dialog"),[
        m("div",{style:"text-align:center; font-size:16px; color:orange; font-weight:bold; line-height:40px;"},"ERROR"),
        m("div",{style:"text-align:left; padding:0 12px; font-size:12px; color:#666666; font-weight:bold; height:100px; margin-top:10px; line-height:20px; overflow-y:auto;"},msg),
        m("div",{style:"height:40px; text-align:center;"},[
            m("button",{style:"background-color:orange; color:white; height:40px; padding:0 32px; margin:0 5px; border:0; cursor:pointer; box-shadow:0 0 5px silver;",onclick:msgbox.Hide},"确定")
        ])
    ]);
    document.querySelector("dialog").showModal();
}

msgbox.Info=function(msg){
    msgbox.init();
    document.querySelector("dialog").setAttribute("style","position:fixed; width:300px; height:200px; overflow:hide; box-shadow:0 0 5px silver; border-radius: 10px; border:0; user-select:none; left:calc(50% - 150px); top:calc(50vh - 100px);");
    m.render(document.querySelector("dialog"),[
        m("div",{style:"text-align:center; font-size:16px; color:green; font-weight:bold; line-height:40px;"},"INFO."),
        m("div",{style:"text-align:left; padding:0 12px; font-size:12px; color:#666666; font-weight:bold; height:100px; margin-top:10px; line-height:20px; overflow-y:auto;"},msg),
        m("div",{style:"height:40px; text-align:center;"},[
            m("button",{style:"background-color:green; color:white; height:40px; padding:0 32px; margin:0 5px; border:0; cursor:pointer; box-shadow:0 0 5px silver;",onclick:msgbox.Hide},"确定")
        ])
    ]);
    document.querySelector("dialog").showModal();
}

msgbox.HanderCallback=function(){
    if(typeof msgbox.callback==="function"){
        msgbox.callback();
    }
}

msgbox.Confirm=function(msg){
    msgbox.init();
    document.querySelector("dialog").setAttribute("style","position:fixed; width:300px; height:200px; overflow:hide; box-shadow:0 0 5px silver; border-radius: 10px; border:0; user-select:none; left:calc(50% - 150px); top:calc(50vh - 100px);");
    m.render(document.querySelector("dialog"),[
        m("div",{style:"text-align:center; font-size:16px; color:blue; font-weight:bold; line-height:40px;"},"INFO."),
        m("div",{style:"text-align:left; padding:0 12px; font-size:12px; color:#666666; font-weight:bold; height:100px; margin-top:10px; line-height:20px; overflow-y:auto;"},msg),
        m("div",{style:"height:40px; text-align:center;"},[
            m("button",{style:"background-color:blue; color:white; height:40px; padding:0 32px; margin:0 5px; border:0; cursor:pointer; box-shadow:0 0 5px silver;",onclick:msgbox.HanderCallback},"确定"),
            m("button",{style:"background-color:#f2f2f2; color:#999999; height:40px; padding:0 32px; margin:0 5px; border:0; cursor:pointer; box-shadow:0 0 5px silver;",onclick:msgbox.Hide},"取消")
        ])
    ]);
    document.querySelector("dialog").showModal();
}